<div ngCombobox readonly disabled>
  <div #origin class="example-select">
    <span class="example-combobox-text">{{ displayValue() }}</span>
    <input aria-label="Label dropdown" placeholder="Select a label" ngComboboxInput />
    <span class="example-arrow material-symbols-outlined">arrow_drop_down</span>
  </div>

  <ng-template
    [cdkConnectedOverlay]="{origin, usePopover: 'inline', matchWidth: true}"
    [cdkConnectedOverlayOpen]="true"
  >
    <ng-template ngComboboxPopupContainer>
      <div class="example-popup-container">
        <div ngListbox>
          @for (label of labels; track label.value) {
            <div ngOption [value]="label.value" [label]="label.value">
              <span class="example-option-icon material-symbols-outlined">{{label.icon}}</span>
              <span class="example-option-text">{{label.value}}</span>
              <span class="example-option-check material-symbols-outlined">check</span>
            </div>
          }
        </div>
      </div>
    </ng-template>
  </ng-template>
</div>
